import {
  defineConfig,
  transformerVariantGroup,
  transformerDirectives,
  presetUno
} from 'unocss'
import presetRemToPx from '@unocss/preset-rem-to-px'

export default defineConfig({
  // 使用预设时presetUno是必须的
  presets: [
    presetUno(),
    presetRemToPx({
      baseFontSize: 4
    }) as any
  ],
  transformers: [
    // lt-sm:(w-100vw c-#111)
    transformerVariantGroup(),
    // @apply
    transformerDirectives()
  ],
  // 自定义规则
  rules: [
    // 多行文本超出部分省略号 line-n。如line-1,line-2 (已内置 line-clamp-n)
    [
      /^line-(\d+)$/,
      ([, l]) => {
        if (~~l === 1) {
          return {
            overflow: 'hidden',
            'text-overflow': 'ellipsis',
            'white-space': 'nowrap',
            width: '100%'
          }
        }
        return {
          overflow: 'hidden',
          display: '-webkit-box',
          '-webkit-box-orient': 'vertical',
          '-webkit-line-clamp': l
        }
      }
    ]
  ]
})
